<template>
    <div class="wrapper" ref="wrapper1">
        <div class="content">
            <slot></slot>
        </div>
    </div>
</template>

<script>
    import BScroll from 'better-scroll'
    // import  ScrollBar from  '@better-scroll/pull-up'

    export default {
        name: "scroll",
        props: {
            probeType: {
                type: Number,
                defalut: 0,
            },
            pullUpLoad: {
                type: Boolean,
                default: false

            }

        },
        data() {
            return {
                scroll: null
            }
        },
        update() {
        },

        methods:{
            finishPullUp(){
                this.scroll.finishPullUp()
            }
    },
        //mounted生命周期函数，在里面创建才能获取BS的数据
        mounted() {
            //1.创建scroll对象
            this.scroll = new BScroll(this.$refs.wrapper1, {
                ObserveDOM: true,//允许控制dom元素
                click: true,//允许点击
                observeImage: true, //等待图片加载
                probeType: this.probeType,
                pullUpLoad: this.pullUpLoad,
                // mouseWheel:true
            })

            //2.监听滚动的位置
            this.scroll.on('scroll', (position) => {
                this.$emit('scroll' ,position)
            })

            // 3.下拉加载更多
            this.scroll.on('pullingUp' ,()=>{
                // console.log("上拉加载更多")
                //发送出去上拉加载事件
                this.$emit('pullingUp')

            })

        }
    }
</script>

<style scoped>

</style>